<template>
  <div>
    <el-dialog v-model="props.visible" title="添加活动" @close="flaspiopo">
      <el-form :model="form" :label-width="formLabelWidth">
        <el-form-item label="活动标题">
          <el-input v-model="props.Sang.title" autocomplete="off" />
        </el-form-item>
      </el-form>

      <el-form :model="form" :label-width="formLabelWidth">
        <el-form-item label="开始时间">
          <el-date-picker v-model="props.Sang.startDate" type="date" placeholder="Pick a day" />
        </el-form-item>
      </el-form>

      <el-form :model="form" :label-width="formLabelWidth">
        <el-form-item label="结束时间">
          <el-date-picker v-model="props.Sang.endDate" type="date" placeholder="Pick a day" />
        </el-form-item>
      </el-form>
      <el-form :model="form" :label-width="formLabelWidth">
        <el-form-item label="上下/下线">
          <el-radio-group v-model="props.Sang.status" class="ml-4">
            <el-radio :label="1">上线</el-radio>
            <el-radio :label="0">下线</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>


      <!-- 二次确认弹窗 -->
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="flaspiopo">取消</el-button>
          <el-button type="primary" @click="flaspiopo">
            确定
          </el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script lang="ts" setup>
import { reactive, ref, toRefs } from "vue";
import { ApiFlashH } from "@/http/hjh.api";




const props = defineProps({
  visible: {
    type: Boolean,
  },
  Sang: {
    type: Object
  }
})
const formLabelWidth = ref("140px")
const emit = defineEmits(['offf'])

// 确定按钮
const flaspiopo = () => {
  emit("offf")
  ApiFlashH(props.Sang).then(res => {

    if (res.code === 200) {

    }
  })
}


const state = reactive({

  form: {
    name: "",
  }
});

const { form, } = toRefs(state);


</script>

<style scoped>
.el-select {
  width: 300px;
}

.el-input {
  width: 300px;
}
</style>
